<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="user-scalable=no,width=device-width, initial-scale=1" id="viewport" name="viewport" initial-scale="1">

<script language="javascript" type="text/javascript" src="../js/js/baseJs.js"></script>

</head>
<body style="background: #eff6ff">

<div class="score-withdraw" id="scoreWithdraw" style="display: none;">
    <div class="wap-header">我的积分
        <a class="back" onClick="javascript:window.history.back();return false;"></a>
    </div>
    <div class="score-content-bd"> 
      <div class="b-score">
        <div class="num"><span v-if="myScore">积分：{{myScore}}分</span><span v-if="!myScore">积分：0分</span></div>
        <a class="get-score-detail" href="../userBundle/myScoreList.mobile.html">查看积分详情</a>
        <a class="get-more" href="../publicBundle/becomeVip.mobile.html">赚取更多积分</a>

      </div>
      <div class="l-score"> 
          <div class="score-record-t" :class="{on:isShowRecordList}" @click="isShowRecordList=true">提现记录</div>
          <div class="withdraw-t" :class="{on:!isShowRecordList}" @click="isShowRecordList=false">申请提现</div>
      </div>
      <div class="record-list"  v-if="isShowRecordList"> 
          <div v-if="!personCashOutApplyData">暂无提现记录！</div>
          <ul v-if="personCashOutApplyData"> 
              <li v-for="apply in personCashOutApplyData">
                <div class="content">
                  <div >{{apply.createTime|time}}</div>
                  <div style="color:#999">支付方式：{{apply.payType|payType}}</div>
                </div>
                <div class="content">
                  <div >积分：{{apply.score}}</div>
                  <div style="color:#559efc;    text-align: right;">{{apply.status|status}}</div>
                </div>
              </li>
          </ul>
      </div>
      <div class="wap-upload-pay-info"> 
        <div class="apply-c pay-info-bd"  v-if="!isShowRecordList">
          <div style="font-size:.22rem;color:#999;text-align:center">说明：每月5，15，25号支持提现申请，1-3个工作日到账</div>
          <div class="select-bd" > 
            <div class="zfb-c" @click="isSelectedZ=true,payType=1,bankPerson=''"> 
              <span :class="{on:payType==1}"></span>
              <div class="text">
                <div>支付宝支付</div>
                <div class="sm">推荐支付宝最新版本</div>
              </div>
            </div>
            <div class="wx-c" @click="isSelectedZ=false,payType=2"> 
              <span :class="{on:payType==2}"></span>
              <div class="text">
                <div>微信支付</div>
                <div class="sm">推荐微信最新版本</div>
              </div>
            </div>
          </div>
          <div class="select-bd" style="margin-top:.4rem"> 
              <div class="wx-c" @click="isSelectedZ=false,payType=3,bankPerson=''"> 
                <span :class="{on:payType==3}"></span>
                <div class="text">
                  <div>银行卡支付</div>
                  <div class="sm">推荐使用主流银行</div>
                </div>
              </div>
           </div> 
          <!--支付宝姓名存放在bankperson里--> 
          <templat v-if="payType!==3"> 

              <div class="l-c"><div class="title">提现金额：</div><input v-model="money" type="number" onkeyup="this.value=this.value.replace(/[^\d]/g,'');"></div>
              <div class="l-c"><div class="title">提现账号：</div><input v-model="account" ></div>
              <div class="l-c" v-if="payType==1"><div class="title">支付宝姓名：</div><input v-model="bankPerson" ></div>
              <div class="l-c">
                <div class="tel">{{userTelephone}}</div>
                <div class="button" v-on:click="sendSms"v-bind:disabled="isSendingSms || (countDownNumber > 0)">
                  <span v-if="countDownNumber==0">获取验证码</span>
                  <span v-if="countDownNumber>0">({{countDownNumber}}S)</span>
                </div>
              </div>
              <div class="l-c" ><div class="title">验证码：</div><input v-model="verification" ></div>
              <div class="info">* 金额和账号为必填</div>
          </templat>
          <templat v-else> 
              <div class="l-c"><div class="title">提现金额：</div><input v-model="money" type="number" onkeyup="this.value=this.value.replace(/[^\d]/g,'');"></div>
              <div class="l-c"><div class="title">开户行名称：</div><input v-model="bankName" ></div>
              <div class="l-c"><div class="title">银行卡账号：</div><input v-model="bankNo" ></div>
              <div class="l-c"><div class="title">开户姓名：</div><input v-model="bankPerson" ></div>
              <div class="l-c">
                <div class="tel">{{userTelephone}}</div>
                <div class="button" v-on:click="sendSms"v-bind:disabled="isSendingSms || (countDownNumber > 0)">
                  <span v-if="countDownNumber==0">获取验证码</span>
                  <span v-if="countDownNumber>0">({{countDownNumber}}S)</span>
                </div>
              </div>
              <div class="l-c" ><div class="title">验证码：</div><input v-model="verification" ></div>
              <div class="info">* 开户行名称银行卡账号开户姓名为必填</div>
          </templat>

          <div class="confirm-btn" @click="saveCashOutApply()">确定提现</div>
        </div>
      </div>
    </div>
</div>
<script src="../js/js/rem_fix.js"></script>
<script src="../js/js/common.js"></script>
<script type="text/javascript">
   var token=getCookie("userToken");
   var userId=getCookie("userId");
   console.log(token)
   console.log(userId)
   var loginUrl="/userBundle/login.mobile.html";

  var shareProjectApp = new Vue({
      el: '#scoreWithdraw', 
      data: {
          myScore:'',
          isShowRecordList:false,
          money:'',
          account:'',
          bankName:'',
          bankNo:'',
          bankPerson:'',
          verification:null,
          userTelephone:'',
          isSmsSent:false,
          payType:1,
          isDoingsaveCashOutApply:false,
          isSelectedZ:true,
          haveApplyDoing:false,
          personCashOutApplyData:[],
          isSendingSms:false,
          sendSmsUrl:"/user/getVerificationCode",
          countDownNumber: 0,
      },
      ready:function(){
        $("#scoreWithdraw").show();
        if(!userId||!token){
          window.location.href=loginUrl;
        }
        // 获取用户信息
        var getUserUrl="/user/getUserById";
        var data={
          client:1,
          token:token,
          userId:userId
        }
        pushData(getUserUrl,data,function(res){
          console.log(res)
            if(res.state){
              this.myScore=res.data.user.scoreTotal;
              this.userTelephone=res.data.user.telephone;
            }else{
              alert(res.message);
            }
        }.bind(this))
        //获取申请列表
        var getPersonCashOutApplyUrl="/cashOut/getPersonCashOutApply";
        var getPersonCashOutApplyData={
          client:1,
          token:token,
          userId:userId,
          page:1,
          size:100000
        };
        pushData(getPersonCashOutApplyUrl,getPersonCashOutApplyData,function(res){
          console.log(res)
          if(res.state){
            if(res.data.personCashOut[0]){
              if(res.data.personCashOut[0].status==0){
              this.haveApplyDoing=true;
              }
            }
            
            this.personCashOutApplyData=res.data.personCashOut;
          }else{
            alert(res.message);
          }
        }.bind(this))
      }, 
      filters:{
        payType: function (key) {
            key = parseInt(key);
            var map = {
                1: "支付宝",
                2: "微信", 
                3: "银行卡"     
            };
            return map[key];
        },
        status: function (key) {
            key = parseInt(key);
            var map = {
                0: "申请中",
                1: "提现成功",
                9:"提现被拒绝"      
            };
            return map[key];
        },
        time:function(timestamp){
         return formatDate(timestamp)
        }
      },
      methods:{
         countDown: function () {
              setTimeout(function(){
                  if (this.countDownNumber >= 1) {
                      this.countDownNumber--;
                      this.countDown();
                  } else {
                      this.countDownNumber = 0;
                  }
              }.bind(this), 1000)
          },
          sendSms: function () {
              if (this.isSendingSms) {
                  return;
              }
              var data = {
                  telephone: this.userTelephone
              };
              this.isSendingSms = true;
              // console.log("df")
              // return;
              pushData(this.sendSmsUrl,data,function(res) {
                  if(res.state){
                        this.countDownNumber = 120;           
                        this.countDown();
                        isSendingSms=false;
                        this.isSmsSent = true;
                  }else{
                    alert(res.message)
                  }
              }.bind(this))
          },
        saveCashOutApply:function(){
          
          if(!this.myScore){
            this.myScore=0;
          }
          console.log(parseInt(this.money))
          console.log(this.myScore)
          if(this.haveApplyDoing){
            alert("您有申请正在等待审核，请勿重复提交");
            return
          }
          if(!this.money){
              alert("请输入提现金额 ")
              return;
          }
          if(!this.verification){
            alert("验证码不能为空，请先获取")
            return
          }
          if(parseInt(this.money)>parseInt(this.myScore)){
            alert("积分不足");
            return;
          }
          if(this.isDoingsaveCashOutApply){
            return;
          }
          if(!this.bankPerson&&this.payType==1){
            alert("请输姓名")
              return;
          }
          if(!this.account&&this.payType!==3){
            alert("请输入账号 ")
              return;
          }
          if(this.payType==3){
            if(!this.bankName||!this.bankNo||!this.bankPerson){
              alert("请输入开户行名称银行卡账号开户姓名")
              return;
             }
          }
          
          this.isDoingsaveCashOutApply=true;
          var url="/cashOut/saveCashOutApply";
          var data={
            bankName:this.bankName,
            bankNo:this.bankNo,
            bankPerson:this.bankPerson,
            account:this.account,
            payType:this.payType,
            score:this.money,
            client:"1",
            token:token,
            userId:userId,
            telephone:this.userTelephone,
            verification:this.verification
          }
          console.log(data);
          pushData(url,data,function(res){
            this.isDoingsaveCashOutApply=false;
            console.log(res)
              if(res.state){
                  alert("申请成功")
                  this.haveApplyDoing=true;
                  window.location.reload();
              }else if(res.errorCode==008){
                  window.location.href="/userBundle/login.mobile.html";
              }
              else{
                  alert(res.message);
              }
          }.bind(this))
        }
        
       
      }
    });

</script>

</body>
</html>